'use strict';

/**
 * Created by ybq on 15-12-31.
 */
angular.module('angular.echart',[])
    .directive('echart', function ($document) {
        return function (scope, element, attrs) {

            console.log(attrs.option);
            // change the attribute
            //  attrs.$set('ecoption', scope.ecoption);
            // observe changes to interpolated attribute
            if (!!!element.css("height")) {
                console.log(element.parent()[0].scrollHeight)
                var height=element.parent()[0].scrollHeight
                var curelem=element.parent()

                for (;!!!height && !!element;) {
                    height=curelem[0].scrollHeight;
                    console.log(height)
                    curelem=curelem.parent()
                }
                element.css("height",height+"px")
            }
            //创建图连接
            function createConnect() {
                if (!!scope.$parent.$echartConnect) {
                    for (var k in scope.$parent.$echartConnect) {

                        echarts.disConnect(k)
                        echarts.connect(k)
                    }
                }
            }
            //创建图
            function createChart(ec,option) {
                if (!!!option) {
                    return;
                }
                if (!!scope.$parent.$echart && !!scope.$parent.$echart[attrs.option]) {
                    scope.$parent.$echart[attrs.option].setOption(option);
                    createConnect()
                } else {
                    var myChart = ec.init(element[0], attrs.theme,{
                        renderer: 'canvas'
                    });
                    scope.$parent.$echart[attrs.option] = myChart;

                    if (!!attrs.connect) {
                        if (!!!scope.$parent.$echartConnect[attrs.connect]) {
                            scope.$parent.$echartConnect[attrs.connect]=[];
                        }
                        myChart.group=attrs.connect;
                        scope.$parent.$echartConnect[attrs.connect].push(myChart)
                    }
                    if (!!option) {
                        myChart.setOption(option, true);
                        createConnect()
                    }
                   angular.element( window).on("resize",function(){
                        myChart.resize()
                   })


                }
            }

            scope.$parent.$echartConnect={};
            scope.$parent.$echart={};
            scope.$watch(attrs.option, function (value) {
                console.log('ecoption has changed value to ' + value);
                // attrs.$set('ecoption', scope.ecoption);
                // 使用
                createChart(echarts,value)
              //  scope.$parent.$echart[attrs.option].setOption(value,true);
                //require(
                //    attrs.echart.split(","),
                //    function (ec) {
                //        createChart(ec,value)
                //    })
            });

            // attrs.$$observers[attrs.ngModel].$scope=scope;

        }

    })
